<?php
include 'header.php';
?>
<div style="margin-left:20px">
<h2>Galeri Produk</h2>
</div>

<div class="panel panel-primary" style="margin-right:10px">
  <!-- Default panel contents -->
  <div class="panel-heading">
  </div>
  <div class="panel-body">
   <div class="hero-unit">
 <?php

if(count($gambar)){
		foreach($gambar as $rows){
			?>

	<div class="column">
  <div class="col-xs-2 col-md-3">
    <a href="#" class="thumbnail">
      <img src="http://localhost/<?php echo $rows['gambar'];?>" style="width: 290px;"height = "100" alt="" onclick="gambar(<?php echo $rows['id_produk']?>);" title="klik untuk melihat deskripsi">


    </a>
  </div>
</div>


<?php


}
}
?>
</div>
</div>
</div>
</div>
<div id="modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="background-color: white;opacity: 1;width: 500px;margin-left: 430px;"">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3 id="myModalLabel">Review Produk</h3>
    </div>
    <div class="modal-body">
        <div class="form-horizontal" >			
			<div class="control-group" id="desk">
			</div>
		</div>
		
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        </div>
    </div>
</div>

<script>
	function gambar(id){
	$('#desk').empty();
	$.post('<?php echo base_url(); ?>index.php/produk/get_desk/',{
		id_produk: id
			}, 
			function(data){
			$.each(data['desk'], function(key, value) {				
				var komen = '<label>Nama Produk: </label><p>'+data['desk'][key].nama_produk+'</p>';
				komen += '<label>Keterangan: </label><p>'+data['desk'][key].ket_produk+'</p>';
				komen += '<label>Harga: </label><p>'+data['desk'][key].harga+'</p>';
				$('#desk').append(komen);
            });
				
				$('#modal').modal('show');
				
        }, 'json');
	}
</script>